<%@ taglib prefix="s" uri="/struts-tags" %>
<html>
	<head>
		<meta name="HandheldFriendly" content="true" />
  		<meta name="viewport" content="width=device-width, height=device-height, user-scalable=no" />
  		<meta name="apple-mobile-web-app-capable" content="yes" />
  		
		<title>Directorio Orq</title>
	
		<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.css" />
		<script src="http://code.jquery.com/jquery-1.6.4.min.js"></script>
		<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js"></script>
		<script type="text/javascript" src="javascript/mostrarRepertorios.js"></script>
		<script type="text/javascript" src="javascript/mostrarInstrumentos.js"></script>
		<script type="text/javascript">
		function irAlInicio(){
			var url_inicio = "index.action";
			document.location = url_inicio;
		}	
		function llamarActionAgregar(repertorio){
			var url = "repertorio_ListaPartiturasParaRepertorio.action";
			var familia = document.forms.buscar.familia.value;
			var instrumento = document.forms.buscar.instrumento.value;
			var autor = document.forms.buscar.autor.value;
				if (document.forms.buscar.familia.selectedIndex==0){
					alert("Seleccione una famlia de instrumentos");
					document.forms.buscar.familia.focus();
					return 0;
				}else{
					if(document.forms.buscar.instrumento.selectedIndex==0){
						alert("Seleccione un instrumento");
						document.forms.buscar.instrumento.focus();
						return 0;
					}else{
						if (document.forms.buscar.autor.selectedIndex==0){
							alert("Seleccione un autor");
							document.forms.buscar.autor.focus();
							return 0;
						}else{
							document.location = url+"?idTipo="+familia+"&idInstrumento="+instrumento+"&idAutor="+autor+"&repertorio.idRepertorio="+repertorio;
						}
					} 
				}
		}
		
		function llamarActionModificar(repertorio){
			var url = "repertorio_Modificar.action";
			var nombre = document.forms.modificarRepertorio.nombre.value;
			var descripcion = document.forms.modificarRepertorio.descripcion.value;
			document.location = url+"?repertorio.idRepertorio="+repertorio+"&repertorio.nombre="+nombre+"&repertorio.descripcion="+descripcion;
			alert("Se ha modificado el repertorio satisfactoriamente");
		}
		function llamarActionRepertorio(idRepertorio,nombre){
			 var url_repertorios = "repertorio_Repertorio.action";
			 document.location = url_repertorios+'?repertorio.idRepertorio='+idRepertorio+'&repertorio.nombre='+nombre;
		 }
		</script>
	</head>
	
	<body>
		<div data-role="page" id="ModificarRepertorios" data-theme="d">
				<div data-role="header" align="center" data-theme="d">
					<a href="#" data-role="button" data-icon="arrow-l" data-transition="slide" data-rel="back" data-iconpos="notext" >Regresar</a>
						<img alt="" src="images/sml-logo.png">
					<a href="#" data-role="button" data-icon="home" data-transition="slide" onclick="irAlInicio()" data-iconpos="notext" >Inicio</a>
				</div>
				<div data-role="content" align="center">
					<h2>Modificar Repertorio</h2>
					<form id="modificarRepertorio">
						<fieldset>
		    					<label for="nombre">Nombre del repertorio:</label>
		    					<input type="text" name="repertorio.nombre" id="nombre" value="<s:property value="repertorio.nombre"/>" data-inset="true"/>
							
								<label for="descripcion">Descripcion:</label>
								<textarea name="repertorio.descripcion" id="descripcion"><s:property value="repertorio.descripcion"/></textarea>
								
								<input type="hidden" name="repertorio.idRepertorio" id="idRepertorio" value="<s:property value="repertorio.idRepertorio"/>"/>
						</fieldset>
						<button type="button" data-inline="true" data-icon="check" onclick="llamarActionModificar(<s:property value="repertorio.idRepertorio"/>)">Modificar</button>							
					</form>
				</div>
				<div data-role="footer" class="ui-bar ui-grid-c" data-position="fixed" data-theme="d" align="center">
					<div class="ui-block-a"><h3 style="margin-top:10px;">Partituras:</h3></div>
					<div class="ui-block-b"><div style="margin:6px 0 0 0px;"><a href="#agregarPartituraRepertorio" data-role="button" data-icon="plus" >Agregar</a></div></div>
					<div class="ui-block-c"><div style="margin:6px 0 0 10px;"><a href="#" data-role="button" data-icon="delete" onclick="llamarActionRepertorio(<s:property value="repertorio.idRepertorio"/>,'<s:property value="repertorio.nombre"/>')">Quitar</a></div></div>														
				</div>	
		</div>
		
		<div data-role="page" id="agregarPartituraRepertorio" data-Theme="d">
			<div data-role="header" align="center" data-theme="d">
					<a href="#" data-role="button" data-icon="arrow-l" data-transition="slide" data-rel="back" data-iconpos="notext" >Regresar</a>
						<img alt="" src="images/sml-logo.png">
					<a href="#" data-role="button" data-icon="home" data-transition="slide" onclick="irAlInicio()" data-iconpos="notext" >Inicio</a>
				</div>
			<div data-role="content" align="center">
				<h3>Buscar Partitura</h3>
				<form id="buscar">
					<fieldset>
	          			<select name="familia" id="familia">
	         				<option value="-1">Seleccione la Familia</option>
	          			</select> 
	          			        
	          			<select name="instrumento" id="instrumento">
	          				<option value="-1">Seleccione el Instrumento</option>
	          			</select>      
	        			
			          	<select name="autor" id="autor">
			          		<option value="-1">Seleccione el Autor</option>
			          	</select>
			          	<input id="repertorio" type="hidden" value="<s:property value="repertorio.idRepertorio"/>">
	        			<br>
	        		</fieldset>
	     				<button data-icon="search" type="button" data-inline="true" onclick="llamarActionAgregar(<s:property value="repertorio.idRepertorio"/>)">Buscar</button>
				</form>
			</div>		
		</div>
	</body>
</html>